/**
 * Created by thinkpad on 2017-05-31.
 */
XBox.define("grid.simple", {
    title:"简单列表",
    templates: {
        main: ["<div>" +
        "            <div class='grid'></div>" +
        "</div>"],
    },
    elements: {
        grid: ".grid"
    },
    urls: {
        get: "datas/grid.simple.json"
    },
    afterRender: function () {

        var that = this;
        var grid = new XBox.grid({
            target: this.controls.grid,
            columns: [{field: "Name", title: "姓名", width: "70px"},
                {field: "Age", title: "年龄", width: "70px"},
                {field: "Tel", title: "电话", width: "140px"},
                {field: "Email", title: "邮箱", width: "140px"},
                {field: "Address", title: "地址", width: "140px"},
                {field: "IsBoy", title: "汉子", width: "70px"}],
            options: {
                sortable: true,//editable: "popup"
            },
            dataSource: {
                transport: {
                    read: {
                        url: this.urls.get,
                        dataType: "json"
                    }
                }, schema: {
                    model: {id: "Id"}
                }
            },
            commands: {
                xcreate: {
                    handler: function (success) {
                        var data1 = {
                            "Id": 100,
                            "Name": "萧峰",
                            "Age": 31,
                            "Tel": "13333333333",
                            "Email": "1212@1212.com",
                            "Address": "丐帮总舵",
                            "IsBoy": true
                        };
                        var data2 = {
                            "Id": 100,
                            "Name": "段誉",
                            "Age": 24,
                            "Tel": "13333333333",
                            "Email": "1212@1212.com",
                            "Address": "大理",
                            "IsBoy": true
                        };

                        var grid = this;
                        grid.addRow();

                        var input = grid.wrapper.find("tr td input");
                        var tr = input.closest("tr");
                        var nData = this.dataItem(tr);
                        input.kendoAutoComplete({
                            dataSource: {
                                data: [data1, data2],
                                schema: {
                                    model: {id: "Id"}
                                }
                            },
                            dataTextField: "Name",
                            template: '<span>#: Name # #: Age # #: Address #</span>',
                            select: function (e) {
                                var value = this.dataItem(e.item).toJSON();
                                for (var key in value) {
                                    nData[key] = value[key];
                                }
                                grid.refresh();

                                // success(value);
                            }
                        });

                        // var wnd = $("<div><div class='info'></div></div>");
                        // var popup = wnd.kendoWindow({
                        //     title: "新增",
                        //     open: function () {
                        //         var www = this;
                        //
                        //         this.form = new XBox.form({
                        //             container: this.element.find(".info"),
                        //             itemClass: "form-item",
                        //             items: {
                        //                 Id: {text: "编号", type: "text"},
                        //                 Name: {
                        //                     text: "姓名", type: "kendo-autoComplete", options: {
                        //                         dataSource: {
                        //                             data: [data1, data2],
                        //                         },
                        //                         dataTextField: "Name",
                        //                         template: '<span>#: Name # #: Age # #: Address #</span>',
                        //                         select: function (e) {
                        //                             var value = this.dataItem(e.item).toJSON();
                        //                             this.form.setValues(value);
                        //                             // success(value);
                        //                         }
                        //                     }
                        //                 },
                        //                 Age: {text: "年龄", type: "kendo-number"},
                        //                 Tel: {text: "电话", type: "text"},
                        //                 Email: {text: "邮箱", type: "text"},
                        //                 Address: {text: "地址", type: "text"},
                        //                 Ok: {
                        //                     text: "确定", type: "button", handler: function (e, f) {
                        //                         var data = f.getValues();
                        //                         success(data);
                        //                         www.destroy();
                        //                     }
                        //                 },
                        //             }
                        //         });
                        //     }
                        // }).data("kendoWindow");
                        // popup.open();
                        // $(".k-popup-edit-form:last").find("input[name=Name]").kendoAutoComplete({
                        //     dataSource: {
                        //         data: [data1, data2],
                        //     },
                        //     dataTextField: "Name",
                        //     template: '<span>#: Name # #: Age # #: Address #</span>',
                        //     select: function (e) {
                        //         debugger;
                        //         var value = this.dataItem(e.item).toJSON();
                        //         $(".k-popup-edit-form:last").find("input[name=Id]").val(value.Id);
                        //         $(".k-popup-edit-form:last").find("input[name=Age]").val(value.Age);
                        //         $(".k-popup-edit-form:last").find("input[name=Tel]").val(value.Tel);
                        //         $(".k-popup-edit-form:last").find("input[name=Email]").val(value.Email);
                        //         $(".k-popup-edit-form:last").find("input[name=Address]").val(value.Address);
                        //         $(".k-popup-edit-form:last").find("input[name=IsBoy]").val(value.IsBoy);
                        //
                        //         // this.close();
                        //         // success(value);
                        //     }
                        // });
                        //
                        // // console.log("新增一条数据", data);
                        // // success(data);
                    }
                },
                xupdate: {
                    handler: function (data, success) {
                        console.log("更新数据，年龄加1", data.toJSON());
                        data.Age++;
                        success(data);
                    }
                },
                xdelete: {
                    handler: function (data, success) {
                        console.log("删除数据", data.toJSON());
                        success(data);
                    }
                },
                xdetail: {
                    handler: function (data) {
                        console.log("展示数据", data.toJSON());
                    }
                }
            }
        })
    }
});